import { Fragment} from "react"
import "./index.css"
import { createFromIconfontCN } from '@ant-design/icons';
import { Button, Tooltip, Space } from 'antd';
import { CheckOutlined } from '@ant-design/icons';
// 自定义 font 图标
const MyIcon = createFromIconfontCN({
    scriptUrl: '//at.alicdn.com/t/c/font_3605787_6pvz9j81tjc.js', // 在 iconfont.cn 上生成
});
const PayType =()=>{
    return(
        <Fragment>
            <div className="d1">
                <MyIcon type="icon-gantanhao-xianxingyuankuang"/>
                注：该支付方式启用并不能正常使用，需要开通支付功能才能使用对应的支付方式
            </div>
            <div className="d2">
                支付方式
            </div>
            <div className="zf">
                <div className="zf1">
                    <div className="img">
                        <img src="https://nimg.ws.126.net/?url=https%3A%2F%2Fcrawl.ws.126.net%2Fnbot2%2Fimg%2F4635304f084a6a1e61e689e5292b48a2.jpg&thumbnail=660x2147483647&quality=80&type=jpg" width={258} height={150}/>
                    </div>
                    <div className="dd1">
                    <div className="txt">
                    支付宝(中国)网络技术有限公司是国内领先的第三方支付平台，致力于提供"简单、安全、快速"的支付解决方案
                    </div>
                        <div className="tool">
                            <div className="tool1">
                                启用
                                <Tooltip title="search">
                                    <Button shape="circle" />
                                </Tooltip>
                            </div>
                            <div className="tool2">
                                关闭
                                <Tooltip title="search">
                                    <Button shape="circle"/>
                                </Tooltip>
                            </div>
                        </div>
                        <div className="btn">
                            <Button type="primary" icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>设置</Button>
                            <Button type="primary" danger icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>删除</Button>
                        </div>
                    </div>
                </div>
                <div className="zf1">
                    <div className="img">
                        <img src="https://img1.baidu.com/it/u=257056610,3647368704&fm=253&fmt=auto&app=138&f=JPEG?w=607&h=398" width={258} height={150}/>
                    </div>
                    <div className="dd1">
                    <div className="txt">
                    支付宝(中国)网络技术有限公司是国内领先的第三方支付平台，致力于提供"简单、安全、快速"的支付解决方案
                    </div>
                        <div className="tool">
                            <div className="tool1">
                                启用
                                <Tooltip title="search">
                                    <Button shape="circle" />
                                </Tooltip>
                            </div>
                            <div className="tool2">
                                关闭
                                <Tooltip title="search">
                                    <Button shape="circle"/>
                                </Tooltip>
                            </div>
                        </div>
                        <div className="btn">
                            <Button type="primary" icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>设置</Button>
                            <Button type="primary" danger icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>删除</Button>
                        </div>
                    </div>
                </div>
                <div className="zf1">
                    <div className="img">
                        <img src="https://5b0988e595225.cdn.sohucs.com/q_70,c_zoom,w_640/images/20180611/51f05b62cfbe498894b78351d747f2eb.jpeg" width={258} height={150}/>
                    </div>
                    <div className="dd1">
                    <div className="txt">
                    支付宝(中国)网络技术有限公司是国内领先的第三方支付平台，致力于提供"简单、安全、快速"的支付解决方案
                    </div>
                        <div className="tool">
                            <div className="tool1">
                                启用
                                <Tooltip title="search">
                                    <Button shape="circle" />
                                </Tooltip>
                            </div>
                            <div className="tool2">
                                关闭
                                <Tooltip title="search">
                                    <Button shape="circle"/>
                                </Tooltip>
                            </div>
                        </div>
                        <div className="btn">
                            <Button type="primary" icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>设置</Button>
                            <Button type="primary" danger icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>删除</Button>
                        </div>
                    </div>
                </div>
                <div className="zf1">
                    <div className="img">
                        <img src="https://trademark.zbjimg.com/pattern-prod/2007/image_9/6340904.jpg" width={258} height={150}/>
                    </div>
                    <div className="dd1">
                    <div className="txt">
                    支付宝(中国)网络技术有限公司是国内领先的第三方支付平台，致力于提供"简单、安全、快速"的支付解决方案
                    </div>
                        <div className="tool">
                            <div className="tool1">
                                启用
                                <Tooltip title="search">
                                    <Button shape="circle" />
                                </Tooltip>
                            </div>
                            <div className="tool2">
                                关闭
                                <Tooltip title="search">
                                    <Button shape="circle"/>
                                </Tooltip>
                            </div>
                        </div>
                        <div className="btn">
                            <Button type="primary" icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>设置</Button>
                            <Button type="primary" danger icon={<MyIcon type="icon-bianjishuru-xianxing"/>}>删除</Button>
                        </div>
                    </div>
                </div>
            </div>           
        </Fragment>
    )
}
export default PayType